<template>
	<div class="app-debug-actions" v-if="isShow">
		<div class="actions">
			<a-button @click="changeMode">
				<BugOutlined></BugOutlined>
			</a-button>
		</div>
		<div class="show-buttons">
			<div class="button"><CaretDownOutlined /></div>
		</div>
	</div>
</template>
<script setup lang="ts">
import { BugOutlined, CaretDownOutlined } from '@ant-design/icons-vue';
import { DebugActionsProps } from './debug-actions';
const props = defineProps(DebugActionsProps);
const helper = App.getDevActionHelper();
const isShow = ref(false);

onMounted(() => {
	if (import.meta.env.VITE_DEBUG === 'TRUE') {
		isShow.value = true;
	}
});

const changeMode = () => {
	helper.changeShowTool();
};
</script>
